<!DOCTYPE html>
<html>
<head>

<title>@[html.title]</title>
<meta charset="UTF-8">
<meta name="author" content="ok">
<meta name="copyright" content="eMag 2010">
<meta name="description" content="Welcome to iphone emag @[prod.vers]">
<!--iphone.meta-->
<link rel="apple-touch-icon" href="apple-touch-icon.png"/>  
<link rel="apple-touch-startup-image" href="apple-touch-startup.png" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="viewport"
	content="width=device-width; initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" />

<!--@html.css@-->
<style type="text/css" media="screen">
@import "css/theme.css";
</style>
<style type="text/css" media="screen">
@import "css/effects.css";
</style>
<style type="text/css" media="screen">
@import "css/cpanel.css";
</style>
<style type="text/css" media="screen">
@import "css/main.css";
</style>

<style type="text/css" media="screen">
@import "css/promo.css";
</style>
<!--@@-->
<!--@html.js@-->
<script type="text/javascript" src="js/utils.js"></script>
<script type="text/javascript" src="js/labels.js"></script>
<script type="text/javascript" src="js/screenPager.js"></script>
<script type="text/javascript" src="js/main.js"></script>

<script type="text/javascript" src="phonegap.0.9.4.min.js"></script>
<script type="text/javascript" src="js/3rd/twitter.js"></script>

<!-- http://twitterjs.googlecode.com/svn/trunk/src/twitter.min.js -->   
<!--@@-->

</head>
<body class="landscape">
<noscript> 
<h1 class="jsDisabled">Please enable javascript support</h1>
</noscript> 

<!--  PROMO MENU -->
<div id="new_TabsControl" class="jPop">
<ul>
	<li id="cpTabReader" class="tapme selected"><span>Reader</span></li>
	<li id="cpTabTwitter" class="tapme"><span>@Emag</span></li>
	<li id="cpTabAbout" class="tapme"><span>About</span></li>
</ul>
</div>

<div id="splashScreen">
	<div><div>LOADING...</div></div>
</div>



<div id="content">

<!--1. READER -->
<div id="scrReader" class="jPage jCurrent">
<!--1.1 Pager -->
<div id="readerPager">
<div id="cntPages"></div>
<div id="curPages">
	<div class="tapme"><span></span><div></div></div>
	<div class="tapme"><span></span><div></div></div>
</div>

<!--1.2 TextView -->
<div id="readerText"><pre></pre></div>
</div>

<!--1.3 Zoom -->
<div id="pageZoom">
<div id="cntPageZoom"><div class="bkgImage"></div></div>
<div id="pageZoomControl">
<ul>
	<li id="cpZoomIn" class="tapme"><span></span></li>
	<li id="cpZoomOut" class="tapme"><span></span></li>
	<li id="cpZoomClose" class="tapme"><span></span></li>
</ul>
</div>

</div>



<!--1.4 Control Panel -->
<div id="controlPanel">
<ul>
	<li id="cpText" class="tapme toggle"><span>Text</span></li>
	<li id="cpIndex" class="tapme"><span>Index</span></li>
	<li id="cpSearch" class="tapme"><span>Search</span></li>
	<li id="cpShare" class="tapme"><span>Share</span></li>
	<li id="cpPgGoTo" class="tapme"><span>GoTo</span></li>
	<li id="cpMore" class="tapme"><span></span></li>
	<li id="cpLess" class="tapme"><span></span></li>
	<li id="cpPgPrev" class="tapme"><span>Prev</span></li>
	<li id="cpPgNext" class="tapme"><span>Next</span></li>
	<li id="cpPgZoom" class="tapme"><span>Zoom</span></li>
</ul>
</div>

</div>
<!--2. BOOK INDEX -->
<div id='scrIndex' class="jPage">
<div class='toolbar'>
<h1>Index</h1>
<a class="button cancel" href="#">Cancel</a> 
<a id="enterPageNum" class="button" href="#">Page#</a></div>
<div id="bookIndex">
</div>
</div>
<!--3. SEARCH -->
<form id='scrSearch' class="jPage">
<div class='toolbar'>
<h1>Search</h1>
<a class="button cancel" href="#">Cancel</a>
</div>
<h2>Nothing found</h2>
<ul class="jUL">
<li><input type="text" id="search" name="search" placeholder="Search term" /></li>
</ul>
<a class="whiteButton search">Search</a> <a class="grayButton clear">Clear</a>
</form>
<!--3.1 SEARCH RESULTS -->
<div id="scrSearchResults" class="jPage">
<div class="toolbar">
<h1>Search results!</h1>
<a class="button cancel" href="#">Cancel</a></div>
<div id="searchResults">
<ul class="jUL">
</ul>
</div>
</div>

<!--4. SHARE -->
<form id="scrShare" class="jPage">
<div class="toolbar">
<h1>Share This!</h1>
<a class="button cancel" href="#">Cancel</a> 
<a id="mailto" class="button" href="#">Email</a></div>
<div id="socBookmarks" style="scrollForm">
<ul class="jUL">
	<li><span id="bmTwitter">Twitter</span></li>
	<li><span id="bmFacebook">Facebook</span></li>
	<li><span id="bmDigg">Digg</span></li>
	<li><span id="bmDelicious">del.icio.us</span></li>
	<li><span id="bmStumbleupon">Stumble Upon</span></li>
	<li><span id="bmMyspace">MySpace</span></li>
</ul>
</div>
</form>

<!--5. PROMO -->
<form id="scrTwitter" class="jPage">
<div class="toolbar">
<h1>Twitter</h1>
<a id="twitterRefresh" class="button" href="#">Refresh</a>
</div>
<div id="tweet">


 <p>Please wait while my tweets load </p>
 <img src="img/loading.gif" />
 <p><a href="http://twitter.com/ukraina">If you can't wait - check out what I've been twittering</a></p>
<ul class="jUL"></ul>
<!-- 
<ul class="jUL">
<li><span id="bmTest">Twitter</span></li>


</ul>-->
</div>
</form>

<!--5.1 ABOUT US -->
<div id="scrAboutUs" class="jPage">
<div class="toolbar">
<h1>About Us</h1>
</div>
<div id="promoContent">
<img id="promoLogo" src="img/logo.png" />

<h1>Example Publications and Product Demo Videos</h1> 
We believe that some of eMagStudio's best qualities are the ability to easily create eMags inhouse and being able to customize your eMags so they engage your readers and strengthen your brand.
<h1>eMag Example Publications</h1>

Our eMagStudio software allows you to create impressive interactive online publications that are customized to fit your own branding and corporate identity. Use your online publications to strengthen your brand and fit your customers' needs. 
It is incredibly easy to customize your own eMags and make them interactive. Here are some examples of different eMags that our customers have created. Click on the images to view the examples.

</div>
</div>

</div>

</body>
</html>
